<template>
    <div class="inst-infomation">
        <div class="header-search">
            <el-row :gutter="10">
                <el-form label-width="90px">
                    <el-col :span="6">
                        <el-form-item label="证券代码">
                            <el-select
                                v-model="searchParam.stockCode"
                                filterable
                                clearable
                                @clear="getBondCodeList('')"
                                remote
                                :remote-method="getBondCodeList"
                                :loading="selectLoading"
                                placeholder="请输入代码或名称"
                                size="mini"
                                style="width: 100%"
                            >
                                <el-option
                                    v-for="item in bondCodeSelectData"
                                    :key="item.dictKey"
                                    :label="item.dictKey + ' ' + item.dictKeyName"
                                    :value="item.dictKey"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="产品代码" :class="{ isInput: searchParam.fundCodes.length > 0 }">
                            <el-select
                                v-model="searchParam.fundCodes"
                                style="width: 100%"
                                size="mini"
                                multiple
                                collapse-tags
                                filterable
                                @change="handleParam('fundCodes')"
                            >
                                <el-option
                                    v-for="item in funds"
                                    :key="item.fundCode"
                                    :value="item.fundCode"
                                    :label="item.showCode + ' ' + item.fundNameSt"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="6" v-show="show">
                        <el-form-item label="下达人">
                            <el-select v-model="searchParam.direactUser" clearable filterable style="width: 100%" size="mini">
                                <el-option
                                    v-for="item in orderUsers"
                                    :key="item.dictKey"
                                    :value="item.dictCode"
                                    :label="item.dictKey + ' ' + item.dictKeyName"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="指令类型">
                            <el-select v-model="searchParam.requestType" clearable filterable style="width: 100%" size="mini">
                                <el-option
                                    v-for="item in requestType"
                                    :key="item.dictKey"
                                    :value="item.dictKey"
                                    :label="item.dictKeyName"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="指令状态">
                            <el-select v-model="searchParam.instructionStatus" clearable filterable style="width: 100%" size="mini">
                                <el-option
                                    v-for="item in instructionStatus"
                                    :key="item.dictKey"
                                    :value="item.dictKey"
                                    :label="item.dictKeyName"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="证券类别">
                            <el-select v-model="searchParam.stockType" clearable filterable style="width: 100%" size="mini">
                                <el-option v-for="item in stockType" :key="item.dictKey" :value="item.dictKey" :label="item.dictKeyName"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="委托方向">
                            <el-select v-model="searchParam.orderDirection" clearable filterable style="width: 100%" size="mini">
                                <el-option
                                    v-for="item in orderDirection"
                                    :key="item.dictKey"
                                    :value="item.dictKey"
                                    :label="item.dictKeyName"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="风险结果">
                            <el-select v-model="searchParam.riskResult" multiple collapse-tags style="width: 100%" size="mini">
                                <el-option
                                    v-for="item in thresholdType"
                                    :key="item.dictKey"
                                    :value="item.dictKey"
                                    :label="item.dictKeyName"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                        <!-- formatter={value => `${value || ''}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')} -->
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="指令序号">
                            <el-input-number
                                style="width: 100%"
                                size="mini"
                                v-model="searchParam.instructionNo"
                                controls-position="right"
                                :min="0"
                                :precision="0"
                            ></el-input-number>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="恒生指令序号">
                            <el-input style="width: 100%" size="mini" v-model="searchParam.hsinstructionNo" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="外部指令序号">
                            <el-input style="width: 100%" size="mini" v-model="searchParam.outOrderCode" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="show">
                        <el-form-item label="数据来源类型">
                            <RiskCustomSelect
                                :selectKeys="searchParam.dataSourceType"
                                :dataSource="nameType.dataSourceType"
                                :showSearch="false"
                                :key="dataSourceTypeNumKey + 'dataSourceTypeNumKey'"
                                @customSelectReturn="customSelectReturn"
                                style="width: 100%"
                            ></RiskCustomSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="type != 'history' && show">
                        <el-form-item label="下达日期">
                            <el-date-picker
                                v-model="searchParam.directDate"
                                type="date"
                                placeholder="请选择"
                                value-format="yyyyMMdd"
                                format="yyyyMMdd"
                                style="width: 100%"
                            >
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-show="SHOW_SECURITY && show">
                        <el-form-item label="组合编码" :class="{ isInput: searchParam.fundCodes.length > 0 }">
                            <el-select v-model="searchParam.fundAccountCodes" style="width: 100%" size="mini" multiple collapse-tags filterable>
                                <el-option
                                    v-for="i in fundAccountCodeSelectData"
                                    :key="i.fundAccountCode"
                                    :label="i.fundAccountCode + ' ' + i.fundAccountName"
                                    :value="i.fundAccountCode"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-form>
            </el-row>
            <el-row style="text-align: right">
                <el-button type="primary" @click="handleButtonClick('reset')">重置</el-button>
                <el-button type="primary" v-authCode="B_0125" @click="handleButtonClick('search')">查询</el-button>
                <el-button @click="handleShowOrHide" style="margin-right: 30px">{{ show ? '隐藏' : '展开' }}</el-button>
                <el-button type="primary" @click="handleButtonClick('layout')">布局设置</el-button>
                <!-- isVerifyAuth={false} -->
            </el-row>
        </div>

        <div id="main-content">
            <el-table
                stripe
                :data="dataSource"
                :key="listMsgNumKey + 'listMsgNumKey'"
                border
                v-loading="tableLoading"
                element-loading-text="加载中"
                size="mini"
                height="calc(100vh - 445px)"
                ref="table"
                style="width: 100%; cursor: pointer"
                @row-click="handleRow"
                highlight-current-row
                highlight-hover-row
                :default-sort="{ prop: sortProp, order: sortOrder }"
                @sort-change="changeTableSort"
            >
                <template v-for="(item, index) in showFieldList">
                    <el-table-column
                        show-overflow-tooltip
                        :key="index"
                        :label="item.content"
                        :prop="item.id"
                        :min-width="item.minWidth + 10 || '130'"
                        :fixed="item.id == 'instructionNo' ? 'left' : undefined"
                        :sortable="'custom'"
                        :sort-orders="['ascending', 'descending']"
                    >
                        <template slot="header">
                            <span>{{ item.content }}</span>
                        </template>
                        <template slot-scope="scope">
                            <!-- <span v-if="item.id == 'operate'"> -->
                            <!-- {/* <RiskButton type='search' icon='eye' AuthCode='B_0126' title='查看' style={{ height: '25px', marginRight: '5px' }} onClick={() => this.handleButtonClick('look', record)} /> */} -->
                            <!-- <RiskIconButton
                                    type="danger"
                                    icon="el-icon-refresh-left"
                                    topTitle="撤单"
                                    @on-click="handleBtnDel(scope.row)"
                                    :disabled="
                                        !(
                                            scope.row.requestType === '2' &&
                                            scope.row.instrctionStatus === '1' &&
                                            getUser().userNickName == scope.row.direactUser
                                        ) || type == 'history'
                                    "
                                ></RiskIconButton>
                            </span> -->
                            <span v-if="item.id == 'instrctionStatus'">
                                {{ invest.instructionStatus[scope.row.instrctionStatus] }}
                            </span>
                            <span v-else-if="item.id == 'requestType'">
                                {{ invest.requestType[scope.row.requestType] }}
                            </span>
                            <span v-else-if="item.id == 'dataSourceType'">
                                {{ (nameType.dataSourceType.find(item => item.dictKey === scope.row.dataSourceType) || {}).dictKeyName }}
                            </span>
                            <span v-else-if="item.id == 'direactUser'">
                                {{
                                    (scope.row.hsOrderUserName && scope.row.hsOrderUserName.trim()) ||
                                    (scope.row.direactUser && scope.row.direactUser.trim()) ||
                                    '--'
                                }}
                            </span>
                            <span v-else-if="item.id == 'sourceType'">
                                {{ DictionConstUtil.SourceType[scope.row.sourceType] || '--' }}
                            </span>
                            <span v-else-if="item.id == 'riskResult'">
                                <StatusTag :code="scope.row.riskResult"></StatusTag>
                            </span>
                            <span v-else-if="item.id == 'directDate'">
                                {{ dateFormat(scope.row[item.id]) || '--' }} {{ timeFormat(scope.row['directTime']) }}
                            </span>
                            <!-- <span v-else-if="item.id == 'directTime'" style="display: block; text-align: center">
                                {{ timeFormat(scope.row[item.id]) || '--' }}
                            </span> -->
                            <span v-else-if="item.id == 'createDate'">
                                {{ dateFormat(scope.row[item.id]) || '--' }} {{ timeFormat(scope.row['createTime']) }}
                            </span>
                            <!-- <span v-else-if="item.id == 'createTime'" style="display: block; text-align: center">
                                {{ timeFormat(scope.row[item.id]) || '--' }}
                            </span> -->
                            <span v-else-if="item.id == 'realDirection'">
                                {{ getOrderDirection(scope.row[item.id]) || '--' }}
                            </span>
                            <span v-else-if="item.id == 'bulkType'">
                                {{ invest.bulkType[value] || '--' }}
                            </span>
                            <span v-else-if="item.id == 'investTypeName'">
                                {{ scope.row['realDirection'] === 'E' ? scope.row.investTypeName || '--' : '--' }}
                            </span>
                            <span v-else-if="item.id === 'calculateValue' || item.id === 'thresholdValue'">{{
                                scope.row[item.id] != undefined ? numberFormat(scope.row[item.id], scope.row.unit) + unitShow(scope.row.unit) : '--'
                            }}</span>
                            <span v-else>{{
                                scope.row[item.id] === 0 || (scope.row[item.id] && (scope.row[item.id] + '').trim()) ? scope.row[item.id] : '--'
                            }}</span>
                        </template>
                    </el-table-column>
                </template>
            </el-table>
            <risk-pagination :paging="pages" @page-change="handleCurrentChange"></risk-pagination>
            <RiskTableLayout
                title="页面布局"
                :visible.sync="layoutDialog"
                :field-list="tableColumns"
                :selected-field-list="selectedFieldList"
                :fixed-field-list="fixedFieldList"
                :table-name="type === 'history' ? 'TH_INSTRUCTION' : 'TI_INSTRUCTION'"
                @on-submit="onSubmit"
            />
        </div>
        <div id="bottom-content" v-loading="tabsLoading">
            <el-tabs v-model="activeKey" @tab-click="handleClick">
                <el-tab-pane label="指令明细" name="detail" class="inst-detail">
                    <div id="detail-content">
                        <InstructionDetail :detailFields="detailFieldsReal" :instructionInfo="instructionDetail" />

                        <!-- <span v-for="item in detailParams" :key="item.val + item.name">
                            <span style="display: inline-block; text-align: right; width: 100px">{{ item.name ? item.name + '：' : '' }}</span>
                            <span v-if="item.type == 'func'" style="color: blue">{{
                                hasClick ? item.funcBody(instructionDetail[item.val], instructionDetail) || '--' : ''
                            }}</span>
                            <span v-else-if="item.val == 'hsOrderUserName'" style="color: blue"
                                >{{
                                    hasClick
                                        ? (instructionDetail.hsOrderUserName && instructionDetail.hsOrderUserName.trim()) ||
                                          (instructionDetail.direactUser && instructionDetail.direactUser.trim()) ||
                                          '--'
                                        : ''
                                }}
                            </span>
                            <span v-else style="color: blue">{{
                                instructionDetail[item.val] === 0 ||
                                (instructionDetail[item.val] && (instructionDetail[item.val] + '').trim()) ||
                                instructionDetail[item.val] == '空'
                                    ? instructionDetail[item.val]
                                    : hasClick
                                    ? '--'
                                    : ''
                            }}</span>
                        </span> -->
                    </div>
                </el-tab-pane>

                <el-tab-pane label="指令证券" name="stock">
                    <div style="height: 170px; padding: 4px 10px">
                        <risk-table :msg="instStockMsg" :key="stockKey"></risk-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane v-if="showPledgeTab" label="指令质押券" name="pledge">
                    <div style="height: 170px; padding: 4px 10px">
                        <risk-table :msg="instPledgeMsg"></risk-table></div
                ></el-tab-pane>
                <el-tab-pane label="指令结果" name="result">
                    <div style="height: 170px; padding: 4px 10px">
                        <risk-table
                            :msg="instResultMsg"
                            @handleBtn="handleBtnLook"
                            :key="instResultMsgNumKey + 'instResultMsgNumKey'"
                            v-if="activeKey === 'result'"
                        ></risk-table></div
                ></el-tab-pane>
            </el-tabs>
        </div>
        <DeleteInvest
            :deleteBidShow="showDeleteInvst"
            :rowData="deleteRowData"
            @deleteBidReturn="deleteInvestReturn"
            v-if="showDeleteInvst"
        ></DeleteInvest>
    </div>
</template>
<script lang="ts">
import RiskTable from '@/common/components/risk-table.vue';
import Invest from '@/common/dict/invest';
import { getInstSelectOrderUser, getStockReportSelect } from '@/pages/baseparam/api';
import DictionConstUtil, { SGU_CACHE } from '@/utils/diction-const-util';
import {
    dateFormat,
    PrefixInteger,
    numberFormat,
    timeFormat,
    unitShow,
    sortBy,
    objToVxeFilterArr,
    accMul,
    getConfigItem,
    numberFormatXDAY,
    numberFormatCIB,
} from '@/utils/tools';
import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
import * as moment from 'moment';
import RiskCustomSelect from '@/common/components/risk-custom-select.vue';
import RiskTableLayout from '@/common/components/risk-table-layout.vue';
import RiskIconButton from '@/common/components/risk-icon-button.vue';
import StatusTag from '@/pages/risk-measure/components/status-tag.vue';
import DeleteInvest from './deleteInvest.vue';
import { getUser } from '@/utils/user-util';
import ColumnUtil from '../utils/column-util';
import InstructionDetail from '@/pages/risk-time/components/instruction-detail.vue';
import RiskPagination from '@/common/components/risk-pagination.vue';
import XEUtils from 'xe-utils';

export interface pages {
    total?: number;
    pageSize?: number;
    currentPage?: number;
}
@Component({
    name: 'InstInfomation',
    components: {
        RiskTable,
        RiskCustomSelect,
        RiskTableLayout,
        RiskIconButton,
        StatusTag,
        DeleteInvest,
        InstructionDetail,
        RiskPagination,
    },
})
export default class InstInfomation extends Vue {
    SHOW_SECURITY = getConfigItem('SHOW_SECURITY');
    WEB_DOCKING = getConfigItem('WEB_DOCKING');
    numberFormatXDAY = numberFormatXDAY;
    numberFormat = numberFormat;
    unitShow = unitShow;
    accMul = accMul;
    ColumnUtil = new ColumnUtil();
    invest = new Invest();

    @Prop() type: string;
    private pages: pages = {
        pageSize: 50,
        currentPage: 1,
        total: 0,
    };

    DictionConstUtil = DictionConstUtil;
    dateFormat = dateFormat;
    timeFormat = timeFormat;
    getUser = getUser;
    fundAccountCodeSelectData: any[] = []; // 组合编码下拉框数据
    private searchParam: any = {
        direactUser: '',
        fundCodes: [],
        fundAccountCodes: [], // 券商模式
        requestType: '',
        instructionStatus: '',
        stockCode: '',
        stockType: '',
        orderDirection: '',
        instructionNo: undefined,
        outOrderCode: '',
        directDate: '',
        riskResult: '', // 风险结果
        hsinstructionNo: '',
        dataSourceType: ['1', '2', '3'],
        showError: true, // 显示错误类型
    };

    private searchParamModel: any = {
        direactUser: '',
        fundCodes: [],
        requestType: '',
        instructionStatus: '',
        stockCode: '',
        stockType: '',
        orderDirection: '',
        instructionNo: undefined,
        outOrderCode: '',
        directDate: '',
        riskResult: '', // 风险结果
        hsinstructionNo: '',
        dataSourceType: [],
        showError: true, // 显示错误类型
    };

    // 指令证券
    private instStockMsg = {
        returnData: {},
        dataKey: 'list',
        title: [],

        checked: { on: false, option: false },
        hidePage: true,
        height: '160px',
    };

    refinanceStockColumns = [
        {
            name: '指令序号',
            val: 'instNo',
            minWidth: 100,
        },
        {
            name: '恒生指令序号',
            val: 'dailyInstructionNo',
            minWidth: 110,
        },
        {
            name: '产品代码',
            val: 'fundCode',
            minWidth: 100,
            // funcBody: (value) => DictionConstUtil.FNFundShowCode(value)
        },
        {
            name: '产品名称',
            val: 'fundNameSt',
            minWidth: 100,
        },
        {
            name: '组合编码',
            val: 'fdAcCode',
            minWidth: 120,
        },
        {
            name: '组合名称',
            val: 'fdAcName',
            minWidth: 120,
        },
        {
            name: '证券代码',
            val: 'stockCode',
            minWidth: 130,
        },
        {
            name: '证券名称',
            val: 'stockNameSt',
            minWidth: 150,
        },

        {
            name: '委托方向',
            val: 'realDirection',
            minWidth: 150,
        },
        { name: '转入组合编码', val: 'destCombiId', minWidth: 150 },
        { name: '转入组合名称', val: 'destCombiName', minWidth: 150 },
        { name: '转入证券代码', val: 'destSecurityCode', minWidth: 120 },
        { name: '转入证券名称', val: 'destSecurityName', minWidth: 120 },
        {
            name: '转入投资类型',
            val: 'investType',
            minWidth: 120,
            type: 'func',
            funcBody: (value, row) => (row['originalDirection'] === 'E' && value && value !== '0' ? this.invest.investType[value] : '--'),
        },
        { name: '巨额赎回', val: 'bulkType', minWidth: 120, type: 'func', funcBody: value => this.invest.bulkType[value] || '--' },
        {
            name: '交易市场',
            val: 'marketCode',
            minWidth: 100,
            type: 'func',
            funcBody: value => this.nameType.marketCode[value] || '--',
        },
        {
            name: '投资类型',
            val: 'investType',
            minWidth: 100,
            type: 'func',
            funcBody: value => this.invest.investType[value] || '--',
        },
        {
            name: '指令数量',
            val: 'instAmount',
            minWidth: 100,
            type: 'funcNumber',
            funcBody: value => (value != undefined ? numberFormat(value, 2) : '--'),
        },
        {
            name: '指令价格',
            val: 'instPrice',
            minWidth: 100,
            type: 'funcNumber',
            funcBody: value => (value != undefined ? numberFormat(value, 2) : '--'),
        },
        {
            name: '指令金额',
            val: 'instBalance',
            minWidth: 100,
            type: 'funcNumber',
            funcBody: value => (value != undefined ? numberFormat(value, 2) : '--'),
        },
        {
            name: '请求类型',
            val: 'requestType',
            minWidth: 100,
            type: 'func',
            funcBody: value => this.invest.requestType[value],
        },
        {
            name: '指令状态',
            val: 'instStatus',
            minWidth: 100,
            type: 'func',
            funcBody: value => this.invest.instructionStatus[value] || '--',
        },
        {
            name: '来源类型',
            val: 'sourceType',
            minWidth: 100,
            type: 'func',
            funcBody: value => DictionConstUtil.SourceType[value] || '--',
        },
        {
            name: '交割日',
            val: 'deliveryDate',
            minWidth: 100,
        },
        {
            name: '回购日期',
            val: 'repoDate',
            minWidth: 100,
        },
        {
            name: '回购天数',
            val: 'repoDay',
            minWidth: 100,
        },
        {
            name: '回购到期日',
            val: 'repurDate',
            minWidth: 100,
        },
        {
            name: '存款类型',
            val: 'depositType',
            minWidth: 100,
            type: 'func',
            funcBody: value => this.invest.depositType[value] || '--',
        },
        {
            name: '存款利率',
            val: 'reate',
            minWidth: 100,
            type: 'funcNumber',
            funcBody: value => (value != undefined ? numberFormat(value, 2) : '--'),
        },
        {
            name: '存款期限(天)',
            val: 'poDayTerm',
            minWidth: 100,
        },
        {
            name: '银行总行代码',
            val: 'bankCode',
            minWidth: 100,
        },
        {
            name: '银行总行名称',
            val: 'bankNameSt',
            minWidth: 150,
        },
        {
            name: '提前支取类型',
            val: 'advanceType',
            minWidth: 130,
            type: 'func',
            funcBody: value => this.invest.advanceLimitFlag[value] || '--',
        },
    ];

    // 指令质押权
    private instPledgeMsg = {
        returnData: {},
        dataKey: 'list',
        title: this.ColumnUtil.instPledgeColumns,
        checked: { on: false, option: false },
        hidePage: true,
        height: '160px',
    };
    // 指令结果
    private instResultMsg = {
        returnData: {},
        dataKey: 'list',
        title: this.ColumnUtil.handleColumns(
            [
                // {
                //     name: '外部下单编码',
                //     val: 'outOrderCode',
                //     width: 220,
                //     width: 220,
                //     minWidth: 220,
                // },
                {
                    name: '条目编号',
                    val: 'entryCode',
                    minWidth: 130,
                    sortable: true,
                    search: true,
                    filters: [{ data: '' }],
                },
                {
                    name: '风险说明',
                    val: 'entryName',
                    minWidth: 300,
                    search: true,
                    filters: [{ data: '' }],
                },
                {
                    name: '触警类型',
                    val: 'thresholdType',
                    minWidth: 130,
                    type: 'statusTag',
                    sortable: true,
                    selectSearch: true,
                    filters: objToVxeFilterArr(this.invest.ThresholdType),
                },
                {
                    // 区分于指令查询中的指令结果，多了该字段
                    name: '条目触发值',
                    val: 'thresholdValue',
                    minWidth: 120,
                    type: 'func',
                    funcBody: (value, record) =>
                        value != undefined ? numberFormatCIB(value, record.unit, 'thresholdValue') + unitShow(record.unit) : '--',
                },
                {
                    name: '条目比较方向',
                    val: 'compareType',
                    minWidth: 130,
                    type: 'func',
                    funcBody: value => DictionConstUtil.CompareDirection[value] || '--',
                },
                {
                    name: '计算结果(单位)',
                    val: 'calculateValue',
                    minWidth: 140,
                    type: 'func',
                    funcBody: (value, record) => (value != undefined ? numberFormatCIB(value, record.unit) + unitShow(record.unit) : '--'),
                },
                {
                    name: '产品代码',
                    val: 'fundCode',
                    minWidth: 130,
                    sortable: true,
                    search: true,
                    filters: [{ data: '' }],
                    // type: 'func',
                    // funcBody: value => DictionConstUtil.FNFundShowCode(value),
                },
                {
                    name: '证券代码',
                    val: 'stockCode',
                    minWidth: 150,
                    sortable: true,
                    search: true,
                    filters: [{ data: '' }],
                },
                {
                    name: '计算逻辑',
                    val: 'calLogicShow',
                    minWidth: 250,
                },
                {
                    name: '是否报错',
                    val: 'errorValid',
                    minWidth: 100,
                    type: 'func',
                    funcBody: value => (value === '0' ? '否' : '是'),
                },
                {
                    name: '报错信息',
                    val: 'errorMessage',
                    minWidth: 120,
                },
                {
                    name: '条目KEY',
                    val: 'entryKey',
                    minWidth: 150,
                },
                {
                    name: '流水号',
                    val: 'resultId',
                    minWidth: 150,
                },
                {
                    name: '计算日期',
                    val: 'calculateDate',
                    minWidth: 150,
                    type: 'func',
                    funcBody: (value, record) =>
                        moment(record.calculateDate + ' ' + PrefixInteger(record.calculateTime, 6), 'YYYYMMDD HHmmss').format(
                            'YYYY-MM-DD HH:mm:ss'
                        ) || '--',
                },
                {
                    name: '操作',
                    val: 'operate',
                    width: 60,
                    type: 'btn',
                    btns: [
                        {
                            title: '查看',
                            name: '查看',
                            type: 'primary',
                            icon: 'el-icon-view',
                        },
                    ],
                },
            ],
            'val',
            'fundCode',
            [
                { name: '资产单元编号', val: 'assetCode', width: 110, type: 'func', funcBody: value => value || '--' },
                { name: '资产单元名称', val: 'assetName', width: 110, type: 'func', funcBody: value => value || '--' },
            ]
        ),
        localSearch: true, // 本地搜索
        checked: { on: false, option: false },
        hidePage: true,
        height: '160px',
    };

    // 指令状态
    private instStatusAll = {
        '0': '已归档',
        '1': '已下达成功',
        '3': '已撤销',
    };
    detailFieldsReal: any[] = [];
    refinanceFields: any[] = [
        [
            {
                content: '指令序号',
                id: 'instructionNo',
            },
            {
                content: '指令状态',
                id: 'instrctionStatus',
                needFormat: true,
                formatter: value => this.invest.instructionStatus[value] || '--',
            },
            {
                content: '下达人',
                id: 'hsOrderUserName',
                needFormat: true,
                formatter: (value, row) => (row.hsOrderUserName && row.hsOrderUserName.trim()) || (row.direactUser && row.direactUser.trim()) || '--',
            },
            {
                content: '下达时间',
                id: 'directDT',
                needFormat: true,
                formatter: (value, row) => dateFormat(row.directDate) + ' ' + timeFormat(row.directTime) || '--',
            },
        ],
        [
            {
                content: '产品代码',
                id: 'fundCode',
            },
            {
                content: '产品名称',
                id: 'fundNameSt',
            },
            {
                content: '组合编码',
                id: 'fundAccountCode',
            },
            {
                content: '组合名称',
                id: 'fundAccountName',
            },
            {
                content: '证券代码',
                id: 'stockCode',
            },
            {
                content: '证券名称',
                id: 'stockNameSt',
            },
            {
                content: '证券类别',
                id: 'stockTypeName',
                // needFormat: true,
                // formatter: (value, row) => this.stockType[value] || '--',
            },
        ],
        [
            {
                content: '投资类型',
                id: 'investTypeName',
                needFormat: true,
                formatter: (value, row) => row.investTypeName || '--',
            },
            {
                content: '业务类型',
                id: 'businessTypeName',
            },
            {
                content: '委托方向',
                id: 'realDirection',
                needFormat: true,
                formatter: (value, row) => this.refinaceDirection[value] || '--',
                // orderDirection 转成 realDirection
            },
            { content: '期限(天)', id: 'redeemDay', needFormat: true, formatter: (value, row) => numberFormat(value) || '--' },
            { content: '费率(%)', id: 'price', needFormat: true, formatter: (value, row) => numberFormat(value, 2) || '--' },
            { content: '融出数量(股)', id: 'instAmount', minWidth: 120, needFormat: true, formatter: (value, row) => numberFormat(value, 2) || '--' },
            // orderAmount  改成 instAmount
            {
                content: '交易对手编码',
                id: 'opponentCode',
                minWidth: 120,
                needFormat: true,
                formatter: (value, row) => (value && (value + '').trim()) || '--',
            },
        ],
        [
            { content: '交易对手名称', id: 'opponentName', minWidth: 120 },
            { content: '币种', id: 'curName' },
            { content: '交易市场', id: 'marketName' },
        ],
    ];
    // 指令明细字段
    detailFields: any[] = [
        [
            { content: '指令序号', id: 'instructionNo' },
            { content: '指令批号', id: 'batchNo' },
            { content: '产品代码', id: 'fundCode' },
            { content: '产品名称', id: 'fundNameSt' },
            { content: '证券代码', id: 'stockCode' },
            { content: '组合编码', id: 'fundAccountCode' },
            { content: '组合名称', id: 'fundAccountName' },
        ],
        [
            { content: '交易市场', id: 'marketName' },
            { content: '转入组合编码', id: 'destCombiId' },
            { content: '转入组合名称', id: 'destCombiName' },
            { content: '转入证券代码', id: 'destSecurityCode' },
            { content: '转入证券名称', id: 'destSecurityName' },
            {
                content: '转入投资类型',
                id: 'investTypeName',
                needFormat: true,
                formatter: (value, row) => (row['realDirection'] === 'E' && value && value !== '0' ? row.investTypeName || '--' : '--'),
            },

            {
                content: '巨额赎回',
                id: 'bulkType',
                needFormat: true,
                formatter: (value, row) => this.invest.bulkType[value] || '--',
            },
        ],
        [
            {
                content: '还券模式',
                id: 'repayMode',
                needFormat: true,
                formatter: value => value || '--',
            },
            {
                content: '指令状态',
                id: 'instrctionStatus',
                needFormat: true,
                formatter: value => this.invest.instructionStatus[value],
            },
            {
                content: '指令类型',
                id: 'requestType',
                needFormat: true,
                formatter: value => this.invest.requestType[value],
            },
            {
                content: '下达日期',
                id: 'directDate',
                needFormat: true,
                formatter: value => dateFormat(value),
            },
            {
                content: '下达时间',
                id: 'directTime',
                needFormat: true,
                formatter: value => timeFormat(value),
            },
            {
                content: '下达人',
                id: 'hsOrderUserName',
                needFormat: true,
                formatter: (value, row) => (row.hsOrderUserName && row.hsOrderUserName.trim()) || (row.direactUser && row.direactUser.trim()) || '--',
            },
            {
                content: '来源类型',
                id: 'sourceType',
                needFormat: true,
                formatter: value => DictionConstUtil.SourceType[value],
            },
            {
                content: '数据来源类型',
                id: 'dataSourceType',
                needFormat: true,
                formatter: value => (this.nameType.dataSourceType.find(item => item.dictKey === value) || {}).dictKeyName,
            },
            { content: '恒生指令序号', id: 'dailyInstructionNo' },
        ],
    ];

    // 明细展示字段
    private detailParams = [
        {
            name: '指令序号',
            val: 'instructionNo',
        },
        {
            name: '指令批号',
            val: 'batchNo',
        },
        {
            name: '产品代码',
            val: 'fundCode',
            // DictionConstUtil.FNFundShowCode(this.instructionDetail.fundCode)
        },
        {
            name: '产品名称',
            val: 'fundNameSt',
        },
        {
            name: '组合编码',
            val: 'fundAccountCode',
        },
        {
            name: '组合名称',
            val: 'fundAccountName',
        },
        {
            name: '指令状态',
            val: 'instrctionStatus',
            type: 'func',
            funcBody: value => this.invest.instructionStatus[value],
        },
        {
            name: '指令类型',
            val: 'requestType',
            type: 'func',
            funcBody: value => this.invest.requestType[value],
        },
        {
            name: '下达日期',
            val: 'directDate',
            type: 'func',
            funcBody: value => dateFormat(value),
        },
        {
            name: '下达时间',
            val: 'directTime',
            type: 'func',
            funcBody: value => timeFormat(value),
        },
        {
            name: '下达人',
            val: 'hsOrderUserName',
        },
        {
            name: '来源类型',
            val: 'sourceType',
            type: 'func',
            funcBody: value => DictionConstUtil.SourceType[value],
        },
        {
            name: '数据来源类型',
            val: 'dataSourceType',
            type: 'func',
            funcBody: value => (this.nameType.dataSourceType.find(item => item.dictKey === value) || {}).dictKeyName,
        },
        {
            name: '恒生指令序号',
            val: 'dailyInstructionNo',
        },
    ];
    private deleteRowData: any = {}; // 撤单行

    private listMsgNumKey: number = 0; // 指令数据Key

    private instResultMsgNumKey: number = 0; // 指令结果表Key

    private dataSource: any[] = []; // 指令表数据

    private instStockDataSource: any[] = []; // 指令证券表数据

    private instPledgeDataSource: any[] = []; // 指令质押券表数据

    private instResultDataSource: any[] = []; // 指令结果表数据

    private showDeleteInvst: boolean = false; // 撤单弹框

    private activeKey: string = 'detail'; //  指令当前tabKey

    private instructionDetail: any = {}; //

    private tabsLoading: boolean = false; // 指令标签表数据加载

    private tableLoading: boolean = false; // 表数据加载

    private clickRecord: any = {}; // 当前主表格点击的条目

    private showPledgeTab: boolean = false; // 是否显示质押券标签页

    private show: boolean = false; // 展示或者隐藏

    private stockReport: any[] = []; // 证券代码

    private funds: any[] = []; // 产品代码
    private investPriceSelectData: any = {}; // 价格模式下拉框数据

    private advanceLimitFlagSelectData: any = {}; // 支取类型

    private sourceType = DictionConstUtil.SourceType; // 数据来源

    private stockTypeAll: any[] = []; // 证券类别

    private stockTypePojo: any = {};

    private fundAccounts: any[] = []; // 产品组合信息

    private instructionStatus: any[] = []; // 指令状态

    private stockType: any[] = []; // 证券类别
    refinaceDirection = { l: '证券转融通融出', '98': '转融通提前了结' };

    private requestType: any[] = []; // 指令类型

    private orderDirection: any[] = []; // 订单方向

    private thresholdType: any[] = []; // 触警类型/风险结果

    private orderUsers: any[] = []; // 下达人下拉列表

    private dataSourceTypeNumKey: number = -1; // 下拉数据类型Key

    private layoutDialog: boolean = false; // 布局是否展示

    private sortProp: string = ''; // 排序字段

    private sortOrder: string = ''; // 排序方式

    private hasClick: boolean = false; // 是否已点击
    // 全部表格列
    private tableColumns: any[] = [];

    // 已选择字段列表(不包括固定字段)
    selectedFieldList: any[] = [];

    // 固定字段列表
    fixedFieldList: any[] = [{ content: '指令序号', id: 'instructionNo', fixed: 'left' }];

    private showFieldList: any[] = []; // 要显示的表格列

    private nameType: any = {
        dataSourceType: [],
        marketCode: {}, // 交易市场
    };

    stockKey: number = -1; // 指令证券渲染Key

    beforeUpdate() {
        this.$nextTick(() => {
            // 在数据加载完，重新渲染表格
            (this.$refs['table'] as any).doLayout();
        });
    }

    async mounted() {
        if (this.SHOW_SECURITY) {
            // this.$axios.get('/asset/list/byFundCode').then((res: any) => {
            //     this.assetCodeSelectData = res;
            // });
            this.$axios.get('/fdAc/list/byFundCode').then((res: any) => {
                this.fundAccountCodeSelectData = res;
            });
        }
        this.getColumnFields(this.detailFields);
        // this.detailFieldsReal = this.detailFields;
        if (this.type == 'history') {
            this.fixedFieldList = [{ content: '指令序号', id: 'instructionNo', fixed: 'left' }];
        } else {
            this.fixedFieldList = [{ content: '指令序号', id: 'instructionNo', fixed: 'left' }];
        }

        let values = await DictionConstUtil.FNInstructionDataSourceType();
        let dataSourceTypes = JSON.parse(JSON.stringify(values)).sort((a, b) => {
            return a.dictKey > b.dictKey ? 1 : -1;
        });
        this.nameType.dataSourceType = dataSourceTypes;
        this.dataSourceTypeNumKey++;

        this.nameType.marketCode = DictionConstUtil.ListToPojo(await DictionConstUtil.FNMarketType());
        // this.nameType.FNFundShowCode = await DictionConstUtil.FNFundShowCode;

        // 产品信息
        // this.funds = await SGU_CACHE('FundInfo', '/fundInfo/list', []);
        this.funds = await SGU_CACHE('FundInfoByUser', '/fundInfo/list/byUser/like', []);

        // 产品组合信息
        (await DictionConstUtil.FNFundAccount()).forEach(item => {
            this.fundAccounts[item.fundCode] = item.fundAccounts;
        });
        // 支取类型
        this.advanceLimitFlagSelectData = this.invest.advanceLimitFlag;

        // 获取价格模式下拉框数据
        this.investPriceSelectData = await SGU_CACHE('PriceType', '/dict/list/code/Y_000237', []);

        // 证券类别
        this.stockTypeAll = await DictionConstUtil.FNStockType();

        this.stockTypePojo = DictionConstUtil.ListToPojo(this.stockTypeAll);
        // 获取指令信息
        this.getInstruction(this.searchParam, this.pages);

        // 目前的字段设置(勾选字段)
        this.FNTableLayout();

        // 新增部分，发送Ajax获取  “证券代码”列表
        this.getBondCodeList('');

        // 指令状态
        this.instructionStatus = DictionConstUtil.PojoToList(this.invest.instructionStatus);
        // 证券类别
        this.stockType = await DictionConstUtil.FNStockType();
        // 指令类型
        this.requestType = DictionConstUtil.PojoToList(this.invest.requestType);
        // 订单方向
        this.orderDirection = await DictionConstUtil.FNTradeDirection();
        // 触警类型/风险结果
        this.thresholdType = DictionConstUtil.PojoToList(DictionConstUtil.ThresholdType);

        // 下达人下拉列表
        this.$axios.post('/instruction/user/select').then((res: any) => {
            this.orderUsers = res;
        });
    }

    // 字段
    getColumnFields(values1) {
        this.detailFieldsReal = this.ColumnUtil.handleDetailFieldsOnSecurity(values1, true, this.ColumnUtil.otherAssetColumns, 'id', 'fundNameSt');
    }

    // 处理参数
    handleParam(param: string) {
        if (param == 'fundCodes') {
            // 获取组合编码下拉框数据
            this.$nextTick(() => {
                this.searchParam.fundAccountCodes = this.searchParam.fundAccountCodes.filter(key => {
                    let index = this.fundAccountCodeSelectData.findIndex(item => item.fundAccountCode == key);
                    return index > -1;
                });
            });
        }
    }

    /**
     * 提交成功后回调
     * @param {Object} 回调数据
     */
    async onSubmit(data) {
        this.FNTableLayout();
    }

    // 表格布局
    private async FNTableLayout() {
        let tableName = this.type === 'history' ? 'TH_INSTRUCTION' : 'TI_INSTRUCTION';
        let columns: any = await new Promise((resolve, reject) => {
            this.$axios
                .get('/tableLayout/query/' + tableName)
                .then((res: any) => {
                    res = res ? JSON.parse(res.replace(/\\/g, '\\\\')) : null;
                    resolve(res);
                })
                .catch(err => {
                    reject(err);
                });
        });

        // 返回不为空
        if (!columns) {
            // 如果布局设置为空时 则说明未设置过布局 这里给出默认值
            let value = this.settingTableColumn();
            let defaultTags = [];
            for (let i = 0; i < value.length; i++) {
                if (!(value[i].id === 'instructionNo' || value[i].id === 'operate')) {
                    defaultTags.push({ id: value[i].id, content: value[i].content });
                }
            }
            columns = defaultTags;
        }

        this.selectedFieldList = columns;
        this.showFieldList = this.selectedFieldList.concat(this.fixedFieldList);
        this.listMsgNumKey++;
    }

    private rowClickSetTime = null;

    private selectLoading: boolean = false; // 下拉框加载
    private bondCodeSelectData: any[] = []; // 证券代码下拉框数据

    // 获取证券代码下拉框数据
    private getBondCodeList(e: string): void {
        this.selectLoading = true;
        // getStockReportSelect(-1, {
        //     dictKey: e,
        //     dictKeyName: e,
        // })
        this.$axios
            .post('/dict/comprehensive/stock/select', {
                dictKey: e,
                dictKeyName: e,
            })
            .then((res: any) => {
                // console.log(res);

                this.bondCodeSelectData = res || [];
                this.selectLoading = false;
            })
            .catch(() => {
                this.selectLoading = false;
            });
    }

    // 点击单行
    async handleRow(obj: any): Promise<void> {
        console.log(obj, 'clickRecord');

        this.clickRecord = obj;
        const form = {
            serialNo: this.clickRecord.serialNo, // 流水号
            instNo: this.clickRecord.instructionNo, // 指令序号
            outOrderCode: this.clickRecord.outOrderCode, // 外部指令序号
            showError: true, // 产品true, 浦银false
            dailyInstructionNo: this.clickRecord.dailyInstructionNo || 0, // 恒生指令序号
            indexDailyModify: this.clickRecord.indexDailyModify || 0, // 恒生指令修改次序
            sourceType: this.clickRecord.sourceType, // 数据来源类型 (判断是否外部指令下达)
        };
        let record = obj;
        if (record.realDirection == '~') {
            record.repayMode = '即时还券';
        }
        // 点击行
        this.tabsLoading = true;

        if (obj.businClass === '2' && ['5', '6'].includes(obj.realDirection)) {
            this.showPledgeTab = true;
        } else {
            this.showPledgeTab = false;
        }

        if (record.realDirection == 'l' || record.realDirection == '98') {
            this.getColumnFields(this.refinanceFields);
            this.instStockMsg.title = this.ColumnUtil.instStockColumns;
        } else {
            this.getColumnFields(this.detailFields);
            this.instStockMsg.title = this.ColumnUtil.handleTableColumns(this.refinanceStockColumns, 'val');
        }

        this.instructionDetail = record;
        this.hasClick = true;

        if (this.rowClickSetTime) {
            clearTimeout(this.rowClickSetTime);
            this.rowClickSetTime = null;
        }
        this.rowClickSetTime = setTimeout(() => {
            let isHistory = this.type === 'history';
            let url = '';
            // if (isHistory) {
            //     url = '/instruction/inst/history/all/' + record.instructionNo + '/' + record.outOrderCode;
            // } else {
            //     url = '/instruction/inst/all/' + record.instructionNo + '/' + record.outOrderCode;
            // }
            // url += '?showError=true';
            // if (obj.serialNo) {
            //     url += '&serialNo=' + obj.serialNo;
            // }
            if (isHistory) {
                url = '/instruction/inst/history/all/new';
            } else {
                url = '/instruction/inst/all/new';
            }

            this.$axios.post(url, form).then((res: any) => {
                let instStockDataSource = [];
                if (record.businClass === 'x') {
                    instStockDataSource = res.rzrqStocks;
                } else if (record.realDirection == 'l' || record.realDirection == '98') {
                    instStockDataSource = res.securityLoans;
                    instStockDataSource.forEach(item => {
                        item.instPrice = item.instAmount ? item.instBalance / item.instAmount : '0';
                    });
                } else {
                    if (res.deposits && res.deposits.length > 0) {
                        instStockDataSource = instStockDataSource.concat(res.deposits);
                    }
                    if (res.repos && res.repos.length > 0) {
                        instStockDataSource = instStockDataSource.concat(res.repos);
                    }
                    if (res.stocks && res.stocks.length > 0) {
                        instStockDataSource = instStockDataSource.concat(res.stocks);
                    }
                }
                // #26961
                if (res.derivativeS && res.derivativeS.length > 0) {
                    instStockDataSource = instStockDataSource.concat(res.derivativeS);
                }
                instStockDataSource.forEach((item, i) => (item.key = item.serialNo + '-' + i));
                this.instStockDataSource = instStockDataSource;
                this.$set(this.instStockMsg.returnData, 'list', this.instStockDataSource);
                // 融资融券回购‘指令价格’列名改为‘回购利率’
                let columns: any = this.instStockMsg.title;
                this.instStockMsg.title.forEach(ele => {
                    if (ele.val === 'instPrice') {
                        if (['5', '6'].includes(obj.realDirection)) {
                            this.$set(ele, 'name', '回购利率(%)');
                            this.$set(ele, 'funcBody', value => (value != undefined ? numberFormat(accMul(value, 100), 2) : '--'));
                        } else {
                            this.$set(ele, 'name', '指令价格');
                            this.$set(ele, 'funcBody', value => (value != undefined ? numberFormat(value, 2) : '--'));
                        }
                    }
                });

                this.stockKey++;

                if (res.results && res.results.length > 0) {
                    res.results.forEach((item, i) => (item.key = item.entryCode + '-' + i));
                    res.results = res.results.sort(sortBy('thresholdType', 'desc'));
                }
                this.instResultDataSource = res.results;
                this.$set(this.instResultMsg.returnData, 'list', this.instResultDataSource);

                let instPledgeDataSource = res.pleds;
                // 处理质押券数据
                instPledgeDataSource &&
                    instPledgeDataSource.forEach((ele, i) => {
                        ele.key = ele.serialNo + '-' + i;
                        // 交易市场
                        ele.marketName = this.nameType.marketCode[ele.marketCode];
                        // 券面总额
                        ele.totalFacePrice = ele.totalFacePrice / 10000;
                        // 成交金额
                        ele.balance = (ele.totalFacePrice * ele.pledgeRate) / 100;
                    });
                this.$set(this.instPledgeMsg.returnData, 'list', instPledgeDataSource);

                // if (res.instructionDetail) {
                //     this.instructionDetail = Object.assign(this.instructionDetail, res.instructionDetail);
                // }
                this.tabsLoading = false;
            });
        }, 500);
    }

    //  获取指令信息
    private getInstruction(param: any, paging: any): void {
        this.tableLoading = true;
        let url = '';
        if (this.type === 'history') {
            url = '/instruction/history/query';
        } else {
            url = '/instruction/query';
        }
        this.$axios
            .post(url, {
                ...param,
                paging: paging,
            })
            .then((res: any) => {
                if (res.list && res.list.length > 0) {
                    res.list.forEach(item => {
                        item.key = item.instructionNo;
                        let fundNameSt = '';
                        this.funds.forEach(ele => {
                            if (ele.fundCode === item.fundCode) {
                                fundNameSt = ele.fundNameSt;
                                return;
                            }
                        });
                        item.fundNameSt = fundNameSt || '';
                        item.fundAccountName =
                            ((this.fundAccounts[item.fundCode] || []).find(item1 => item1.fundAccountCode === item.fundAccountCode) || {})
                                .fundAccountName || '';
                    });
                    // .filter(item => item.riskResult != '4')
                    this.dataSource = res.list;
                    this.pages.total = res.total;
                    this.tableLoading = false;
                    this.handleRow(res.list[0]);
                } else {
                    this.dataSource = [];
                    this.pages.total = 0;
                    this.tableLoading = false;
                }
                let keyIndex = this.dataSource.findIndex(item => item.key == this.clickRecord.key);
                if (keyIndex || keyIndex === 0) {
                    (this.$refs as any).table.setCurrentRow(this.dataSource[keyIndex]);
                }
            })
            .catch(() => {
                this.tableLoading = false;
            });
    }

    // 按钮点击
    private handleButtonClick(action: string) {
        if (action === 'search') {
            // 获取条件，开始查找
            this.handleSearchClose('search', this.searchParam);
        } else if (action === 'layout') {
            this.layoutDialog = true;
            this.tableColumns = this.settingTableColumn();
        } else if (action == 'reset') {
            this.searchParam = JSON.parse(JSON.stringify(this.searchParamModel));
            this.getBondCodeList('');
            this.dataSourceTypeNumKey++;
        }
    }

    // 搜索事件
    private handleSearchClose(action: string, searchParam: any): void {
        if (action !== 'cancel') {
            this.pages = {
                // 分页
                total: 0,
                currentPage: 1,
                pageSize: 50,
            };
            this.getInstruction(this.searchParam, this.pages);
        }
    }

    // 是否展开
    private handleShowOrHide(): void {
        this.show = !this.show;
    }

    // 分页
    private handleCurrentChange(curPage: number): void {
        //    this.pages.currentPage = curPage;
        this.getInstruction(this.searchParam, this.pages);
    }

    // 查看按钮点击
    private handleBtnLook(obj: any): void {
        // 点击的指令结果行、是否为历史数据、当前行(指令)
        this.$emit('handelOperate', { record: obj.row, history: this.type === 'history', clickRecord: this.clickRecord });
    }

    // 详细信息tabs切换
    private handleClick(tab, event) {}

    // 撤单按钮点击
    private handleBtnDel(row: any): void {
        this.deleteRowData = row;
        this.showDeleteInvst = true;
    }

    // 撤单回调返回值
    private deleteInvestReturn(status: boolean): void {
        this.showDeleteInvst = false;
        if (status) {
            this.getInstruction(this.searchParam, this.pages); // 获取指令信息
        }
    }

    // 下拉多选框回调
    private customSelectReturn(values: any): void {
        this.searchParam.dataSourceType = values;
    }

    private getOrderDirection(value: string): void {
        let data = this.orderDirection.find(item => item.dictKey == value);
        return (data || {}).dictKeyName;
    }

    // 全部字段
    private settingTableColumn() {
        let showField = [
            {
                content: '指令序号',
                id: 'instructionNo',
                minWidth: 100,
            },
            {
                content: '恒生指令序号',
                id: 'dailyInstructionNo',
                minWidth: 140,
            },
            {
                content: '指令批号',
                id: 'batchNo',
            },
            {
                content: '证券代码',
                id: 'stockCode',
            },
            {
                content: '业务类型',
                id: 'businessTypeName',
                minWidth: 110,
            },
            {
                content: '委托方向',
                id: 'realDirection',
            },
            {
                content: '风险结果',
                id: 'riskResult',

                type: 'statusTag',
            },
            {
                content: '产品代码',
                id: 'fundCode',
                minWidth: 100,
                // funcBody: async value => (await DictionConstUtil.FNFundShowCode)(value),
            },
            {
                content: '产品名称',
                id: 'fundNameSt',
                minWidth: 100,
            },
            {
                content: '组合编码',
                id: 'fundAccountCode',
                minWidth: 110,
            },
            {
                content: '组合名称',
                id: 'fundAccountName',
                minWidth: 110,
            },
            {
                content: '交易市场',
                id: 'marketName',
                minWidth: 110,
            },
            { content: '转入组合编码', id: 'destCombiId', minWidth: 150 },
            { content: '转入组合名称', id: 'destCombiName', minWidth: 150 },
            { content: '转入证券代码', id: 'destSecurityCode', minWidth: 120 },
            { content: '转入证券名称', id: 'destSecurityName', minWidth: 120 },
            { content: '转入投资类型', id: 'investTypeName', minWidth: 120 },
            { content: '巨额赎回', id: 'bulkType', minWidth: 120, type: 'func', funcBody: value => this.invest.bulkType[value] || '--' },
            {
                content: '指令状态',
                id: 'instrctionStatus',
                minWidth: 100,
            },
            {
                content: '指令类型',
                id: 'requestType',
                minWidth: 100,
            },
            {
                content: '来源类型',
                id: 'sourceType',
                minWidth: 100,
            },
            {
                content: '数据来源类型',
                id: 'dataSourceType',
                minWidth: 140,
            },
            {
                content: '下达日期',
                id: 'directDate',
                minWidth: 180,
            },
            // {
            //     content: '下达时间',
            //     id: 'directTime',
            //     minWidth: 100,
            // },
            {
                content: '下达人',
                id: 'direactUser',
                minWidth: 100,
            },
            {
                content: '指令落库日期',
                id: 'createDate',
                type: 'func',
                funcBody: value => dateFormat(value),
            },
            // {
            //     content: '指令落库时间',
            //     id: 'createTime',
            //     type: 'func',
            //     funcBody: value => timeFormat(value),
            // },
        ];
        if (this.WEB_DOCKING == 'FSCINDA') {
            showField = this.ColumnUtil.handleColumns(
                showField,
                'id',
                'dailyInstructionNo',
                [
                    {
                        content: '外部指令序号',
                        id: 'outOrderCode',
                        minWidth: 120,
                    },
                ],
                true
            );
        }
        return this.ColumnUtil.handleTableColumns(showField, 'id');
    }

    // 排序改变
    private changeTableSort(column: any): void {
        this.sortProp = column.prop;
        this.sortOrder = column.order;
        let sortType = column.order == 'ascending' ? 'ASC' : column.order == 'descending' ? 'DESC' : '';
        this.searchParam['sort'] = this.findName(column.prop, sortType);
        this.pages.currentPage = 1;
        this.getInstruction(this.searchParam, this.pages);
    }

    // 获取排序字段名称
    private findName(name: string, order: string): string {
        let value = '';
        switch (name) {
            case 'instructionNo':
                value = 'N_INST_NO' + ' ' + order;
                break;
            case 'outOrderCode':
                value = 'C_OUT_ORDER_CODE' + ' ' + order;
                break;
            case 'dailyInstructionNo':
                value = 'N_DAILY_INSTRUCTION_NO' + ' ' + order;
                break;
            case 'realDirection':
                value = 'C_REAL_DIRECTION' + ' ' + order;
                break;
            case 'dataSourceType':
                value = 'C_SOURCE_TYPE' + ' ' + order;
                break;
            case 'batchNo':
                value = 'N_BATCH_NO' + ' ' + order;
                break;
            case 'stockCode':
                value = 'C_STOCK_CODE' + ' ' + order;
                break;
            case 'businessTypeName':
                value = 'C_BUSINESS_TYPE_NAME' + ' ' + order;
                break;
            case 'riskResult':
                value = 'C_THRESHOLD_TYPE' + ' ' + order;
                break;
            case 'fundCode':
                value = 'C_FUND_CODE' + ' ' + order;
                break;
            case 'fundNameSt':
                value = 'C_FUND_NAME_ST' + ' ' + order;
                break;
            case 'fundAccountCode':
                value = "TO_NUMBER(REGEXP_REPLACE(C_FD_AC_CODE,'[^0-9]',''))" + ' ' + order;
                break;
            case 'fundAccountName':
                value = 'C_FD_AC_NAME' + ' ' + order;
                break;
            case 'instrctionStatus':
                value = 'C_INST_STATUS' + ' ' + order;
                break;
            case 'requestType':
                value = 'C_REQUEST_TYPE' + ' ' + order;
                break;
            case 'sourceType':
                value = 'C_SOURCE_TYPE' + ' ' + order;
                break;
            case 'directDate':
                value = 'CONCAT(D_DIRECT_DATE,D_DIRECT_TIME)' + ' ' + order;
                break;
            case 'direactUser':
                value = 'C_DIREACT_USER' + ' ' + order;
                break;
            case 'directTime':
                value = 'D_DIRECT_TIME' + ' ' + order;
                break;
            case 'marketName':
                value = 'C_MARKET_NAME' + ' ' + order;
                break;
            case 'assetCode':
                value = "TO_NUMBER(REGEXP_REPLACE(C_ASSET_CODE,'[^0-9]',''))" + ' ' + order;
                break;
            case 'assetName':
                value = 'C_ASSET_NAME' + ' ' + order;
                break;
            case 'createDate':
                value = 'CONCAT(D_DT_CT_DATE_YH,D_DT_CT_TIME_YH)' + ' ' + order;
                break;
            case 'createTime':
                value = 'D_DT_CT_TIME_YH' + ' ' + order;
                break;
        }
        return value;
    }
}
</script>
<style lang="scss" scoped>
/deep/ .el-input__inner {
    height: 28px;
    line-height: 28px;
}
/deep/.el-input__icon {
    line-height: 42px !important;
}
// 滚动条的宽度
/deep/.el-table__body-wrapper::-webkit-scrollbar {
    width: 7px; // 横向滚动条
    height: 7px; // 纵向滚动条 必写
}
// 滚动条的滑块
/deep/.el-table__body-wrapper::-webkit-scrollbar-thumb {
    background-color: #c9c9c9;
    border-radius: 3.5px;
}
// vxe-table 筛选容器样式
/deep/.vxe-table--filter-wrapper {
    .vxe-table--filter-body {
        height: 40%;
        max-height: 60px;
        padding-bottom: 0;
    }
    .vxe-table--filter-footer {
        padding: 0.2em;
    }
}
.inst-infomation {
    padding: 10px 20px;
    .header-search {
        border: 1px solid #ccc;
        padding: 10px;
        /deep/.el-form-item {
            margin-bottom: 0px;
            .el-form-item__label {
                padding: 0;
                color: black;
            }
        }
        .isInput /deep/ .el-select__input {
            margin-left: 2px;
        }
    }
}
#main-content {
    border: 1px solid #ccc;
    margin-top: 10px;
    /deep/.el-table {
        // .caret-wrapper {
        //     display: none;
        // }
        th {
            padding: 5px 0 !important;
            background-color: #e8f3ff !important;
            .cell {
                white-space: nowrap; /* 文本在一行显示，不换行 */
                text-overflow: ellipsis; /* 显示省略符号来代表被修剪的文本。*/
                overflow: hidden; /* 超出部分隐藏 */
            }
        }
    }
}
#bottom-content {
    margin-top: 10px;
    border: 1px solid #ccc;
    .inst-detail {
        // 滚动条的宽度
        ::-webkit-scrollbar {
            width: 7px; // 横向滚动条
            height: 7px; // 纵向滚动条 必写
        }
        // 滚动条的滑块
        ::-webkit-scrollbar-thumb {
            background-color: #c9c9c9;
            border-radius: 3.5px;
        }
    }
    #detail-content {
        height: 170px;
        padding: 4px 10px;
        width: 100%;
        overflow-x: auto;
        // padding: 10px;
        // // .el-col-6 {
        // //     color: black;
        // //     height: 32px;
        // //     line-height: 32px;
        // //     font-size: 14px;
        // //     overflow: hidden;
        // // }
        // display: grid;
        // grid-template-columns: repeat(3, 1fr);
        // grid-gap: 4px;
        color: black;
        // margin-bottom: 6px;
        // width: max-content;
        // min-width: 100%;

        span {
            padding: 1px 0;
        }
    }
}

/deep/ .el-select__tags-text {
    font-size: 10px;
}

/deep/ .vxe-table--empty-placeholder {
    top: 38px !important;
    height: 48px !important;
}

/deep/ .el-input-number__decrease:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled),
/deep/ .el-input-number__increase:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled) {
    border-color: #62b4f7;
}
/deep/ .vxe-table .vxe-body--row.row--current {
    background-color: #a8d4f7;
}

/deep/ .vxe-table .vxe-body--row.row--hover {
    background-color: #e6f7ff;
}
/deep/ .el-pagination {
    padding: 5px !important;
}

/deep/ .el-select__tags {
    flex-wrap: nowrap;
}

/deep/ span.el-tag.el-tag--info.el-tag--mini.el-tag--light {
    display: flex;
    align-items: center;
    .el-select__tags-text {
        display: inline-block;
        max-width: 80px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/deep/ .el-table__row {
    td:not(.is-hidden):last-child {
        right: -1px;
    }
}

/deep/ thead th:not(.is-hidden):last-child {
    right: -1px;
}
</style>
